/*//公共样式*/

*{
    box-sizing: border-box;
    //去除浏览器默认样式
    padding: 0;//内边距
    margin: 0;//外边距
}
body{
    background-image: url(img/ai.jpg);//相对路径
    background-repeat:no-repeat;
    background-position: center center;
    //让图片填满
    background-size:cover;

    height: 100%;

}
/*//让图片与浏览器一样不会因为放大缩小变形*/
html{
    height: 100%;
}
/*导航栏*/
.nav{
    height: 70px;
    background-color: rgba(50,50,50,0.15);
    color: white;
/*    使用弹性布局，让里面的元素水平对齐*/
    display: flex;
    align-items: center;

}
.nav img{
    width: 50px;
    height: 50px;
    /*外边距左右边距*/
    margin-right: 30px ;
    margin-left: 30px;
    /*内边距变成圆角矩形*/
    border-radius: 20px;
}
.nav a{
    color: white;
/*    去掉下划线*/
    text-decoration: none;
    /*此处使用内边距把多个链接分开*/
    padding: 0 10px;
}
.space{
    width: 70%;
}
/*页面主题部分*/
.container{
/*    设置固定宽度，水平居中*/
    width: 1000px;
/*    margin-right:auto
margin-right:auto*/
    margin: 0 auto;
/*    设置高度和浏览器一样高*/
/*    height: 100%;*/
/*    在100%的基础上去掉导航栏的高度，减号两边必须有空格*/
    height: calc(100% - 50px);
    /*background-color: black;*/

    display: flex;

/*    让里面的元素等间距铺开*/
    justify-content: space-between;
}
.container-left{
    height:100%;
    width:200px;
    /*background-color: red;*/

}

.container-right{
    height: 100%;
    /*留出5个像素的缝*/
    width: 795px;
    /*加上白色半透明背景*/
    background-color: rgba(255,255,255,0.8);
    border-radius: 10px;
    padding: 15px;
    /*background-color: green;*/

/*    当内容超出了自动添加滚动条*/
    overflow: auto;

}

/*设置用户区域*/
.card{
    background-color: rgba(255,255,255,0.8);
    border-radius: 20px;
    padding: 20px;
}
/*设置用户头像*/
.card img{
    /*//整个card的宽度是200px， .card设置了四个方向的内边距30px*/
    /*剩下能放140*/
    width: 140px;
    height: 140px;
    border-radius: 60px;
    display: flex;
    align-items: center;
}
/*设置用户名*/
.card h3{
    text-align: center;
/*    使用内边距把用户和头像撑开距离*/
    padding: 10px;
}
/*设置gitee地址*/
.card a{
    text-align: center;
    color: gray;
/*去掉下划线*/
    text-decoration: none;
/*    需要把a标签转成块级元素，上述文字水平居中才有意义*/
    display: block;
/*    让a标签和下方有间隔*/
    margin-bottom: 30px;
}
.counter{
    display: flex;
    padding: 5px;
    justify-content: space-around;
}








/*.blog{*/
/*    !*上内边距*!*/
/*    padding: 20px;*/
/*}*/
/*!*设置博客标题*!*/
/*.blog.tile{*/
/*    font-size: 22px;*/
/*    text-align: center;*/
/*    font-weight: 900;*/
/*}*/
/*!*设置发布时间*!*/
/*.blog.date{*/
/*    text-align: center;*/
/*    color: rgb(0,128,0);*/
/*    padding: 10px 0;*/

/*}*/
/*!*设置摘要*!*/
/*.blog.desc{*/
/*    !*text-indent: 28px;*!*/
/*    !*    em也是一个单位，和px是并列的，1em == 应该文字的大小*!*/
/*    text-indent: 2em;*/
/*}*/


